<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>test</title>
    <link rel="stylesheet" href="/css/main/main.css">
</head>
<body th:fragment="part">
<!-- 底部部分 -->
<div class="firstcontentbox">
    <div class="contentbox">
        <!-- 轮播图 -->
        <div class="z">
            <a href="javascript:void(0)">
                <img src="/images/main/l-btn.png" alt="" id="l-btn">
            </a>
            <a href="javascript:void(0)">
                <img id="looppic" class="looppic" src="/images/main/64A4365FD64265F6AC244B048E2_1599CA3A_13F92.jpg"
                     alt="">
            </a>
            <a href="javascript:void(0)">
                <img src="/images/main/r-btn.png" alt="" id="r-btn">
            </a>
        </div>

        <div id="points">
            <span class="shover"></span>
            <span class="normal"></span>
            <span class="normal"></span>
            <span class="normal"></span>
            <span class="normal"></span>
        </div>
    </div>
    <div class="contentbox">
        <div class="y">
            <!-- 最热帖 -->
            <div class="lastestandhottest">
                <ul class="lastestandhottest-ul">
                    <li id="lastest">
                        <span id="lastestBtn">最新贴</span>
<!--                        <button id="lastestBtn" style="height: 100%;width: 100%">最新贴</button>-->
                    </li>
                    <li id="hottest">
                        <span id="hottestBtn">最热帖</span>
<!--                        <button id="hottestBtn" style="height: 100%;width: 100%">最热帖</button>-->
                    </li>
                </ul>
            </div>
            <div class="postcontentbox">
                <div id="postcontent" class="postcontent">
                    <ul id="ulpost" th:fragment="ulpost">
                        <li th:each="post,postListStat : ${postList}">
                            <a th:href="@{'/toMyPost?page=html/editor/lookPost_f&pid='+${post.pid}}" th:text="${post.ptitle}"></a>
<!--                            <a href="viewPost?page=/html/editor/lookPost_f" th:text="${post.ptitle}"></a>-->
                            <span style="float: right" th:text="${post.ptime}"></span></li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="bottom">
    <div class="past">
        <div class="pastname">
            <div class="name">
                <p>帖子分类</p>
            </div>
        </div>
        <div class="pastcontent">
            <table class="">
                <tbody>
                <tr id="posttype" th:fragment="posttype">
                    <td th:each="key:${NumOfPostMap.keySet()}" id="tp" th:fragment="tp">
<!--                        <div id="pic">-->
<!--                            <img src="/images/main/建党百年.jpg" alt="" th:if="${key.tid} eq '1'">-->
<!--                            <img src="/images/main/红色家书.jpg" alt="" th:if="${key.tid} eq '2'">-->
<!--                            <img src="/images/main/革命先烈.jpg" alt="" th:if="${key.tid} eq '3'">-->
<!--                            <img src="/images/main/中国近代.jpg" alt="" th:if="${key.tid} eq '4'">-->
<!--                        </div>-->
                        <div id="tietype">
                            <div>
                                <a th:href="@{'/mypost/mokuai?tid='+${key.tid}}">
                                    <h3><span th:text="${key.ptype}"></span></h3>
                                </a>
                                <span th:text="'贴数：'+ ${NumOfPostMap.get(key)}"></span>
                            </div>
                            <img src="/images/main/帖子方框.jpg" style="z-index: 0;" alt="">
                        </div>
                    </td>
                </tr>
                </tbody>
            </table>
        </div>
    </div>
</div>
<script src="/js/main/looping.js"></script>
<script type="text/javascript" th:inline="javascript">
    // $(function () {
    //     // $("#postcontent").load("viewLastestPost");
    //     // $("#posttype").load("viewPType");
    // });
    $("#hottestBtn").click(function () {
        $.ajax({
            url: "viewHottestPost",
            type: "post",
            success: function (data) {
                $("#postcontent").html(data);
            }
        })
    });
    $("#lastestBtn").click(function () {
        $("#postcontent").load("viewLastestPost");
    });
</script>
</body>
</html>